<template>
  <div class="index-form">
    <form action="form_action.asp" method="get">
      <p>
        <i></i>
        <input type="text" name="fname" placeholder="请输入省份" />
      </p>
      <p>
        <i></i>
        <input type="text" name="lname" placeholder="请输入城市" />
      </p>
      <p>
        <i></i>
        <input type="text" name="fname" placeholder="请输入手机号码" />
      </p>
      <p>
        <i></i>
        <input type="text" name="lname" placeholder="医生姓名" />
      </p>
      <p>
        <i></i>
        <input type="text" name="fname" placeholder="医院名称" />
      </p>
      <p>
        <i></i>
        <input type="text" name="lname" placeholder="科室" />
      </p>
      <p>
        <i></i>
        <input type="text" name="lname" placeholder="职位" />
      </p>
      <p>
        <i></i>
        <input type="file" name="lname" placeholder="上传实时图片" />
      </p>
      <input type="submit" value="Submit" />
    </form>
  </div>
</template>
<style>
.index-form {
  height: inherit;
  background: url(./assets/timg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -o-background-size: cover;
  background-position: center 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.index-form form {
  width: 100%;
  max-width: 480px;
}
.index-form p {
  margin: 0;
  width: 100%;
  display: flex;
  border-bottom: 1px solid #333;
  margin-top: 10px;
}
.index-form i {
  display: inline-block;
  width: 80px;
  text-align: center;
}
.index-form input {
  flex: 1;
  background-color: transparent;
  border: none;
  height: 40px;
  line-height: 40px;
  padding: 0 10px;
  box-sizing: border;
}
</style>